官網教學簡單清楚，可以實做如何打包CSS，圖片，字型，data。
Asset Management

首先電腦要有最新版的 Node 和 Yarn.

Install webpack as dependency

$ yarn add webpack --dev

新增 webpack.config.js

install style-loader and css-loader
$ yarn add style-loader css-loader --dev

install file-loader to load images and fonts
$ yarn add file-loader --dev

install csv-loader and xml-loader to load data
$ yarn add csv-loader xml-loader --dev

如果要讓 Webpack 的提示訊息以 macOS 的原生訊息功能顯示的話，要裝webpack-notifier這個套件。

Install React

$ yarn add react react-dom

Install Babel

$ yarn add babel-core babel-loader babel-preset-env babel-preset-react --dev
Babel is a compiler.
To compile ES6 codes into ES5 syntax.
雖然新的瀏覽器支援 ES6, 但是不完全，像 import, export 就不能用，所以還是需要 Babel.
尤其是專案需要支援 IE 的話，Babel 是一定要裝。

建.babelrc設定檔，或是在 package.json 裡設定 babel 值。
.babelrc · Babel
另外，Babel configuration 也可以在 Webpack babel-loder 裡設定，但是記得要設 babelrc: false 否則會發生衝突。

要用 “env” 的 preset 要先安裝 env package，這個 preset 是取代舊有的 “es2015, es2016, es2017, latest” presets.
$ yarn add babel-preset-env --dev

Babel option 同樣有叫 env 的設定參數，可以自訂不同的開發環境，不要和 “env” preset 搞錯了。